window.onload = function () {
    // let btn = document.getElementById('btn'),
    //     btnWidth = btn.getBoundingClientRect().width,
    //     parent = btn.parentNode,
    //     leftBoundary = btn.getBoundingClientRect().x,
    //     rightBoundary = parent.getBoundingClientRect().x + parent.getBoundingClientRect().width - (btnWidth / 2),
    //     gap = 0,
    //     curBar = btn.nextElementSibling,
    //     curBarBoundingClientRectX = curBar.getBoundingClientRect().x;
    // function moveHandler(e) {
    //     let clientX = e.touches ? e.touches[0].clientX : e.clientX,
    //         parentBoundingClientRectX = this.parentNode.getBoundingClientRect().x,
    //         boundingClientRectX = clientX - gap,
    //         newX = boundingClientRectX - parentBoundingClientRectX,
    //         newWidth = boundingClientRectX - curBarBoundingClientRectX + (btnWidth / 2);
    //     if (boundingClientRectX >= leftBoundary && boundingClientRectX <= rightBoundary) {
    //         this.style.left = `${newX}px`;
    //         this.nextElementSibling.style.width = `${newWidth}px`;
    //     }
    // }
    // btn.ontouchstart = function (e) {
    //     gap = e.touches[0].clientX - this.getBoundingClientRect().x;
    //     this.className = "dot-button focus";
    //     document.ontouchmove = moveHandler.bind(this);
    //     document.ontouchend = (function () {
    //         document.ontouchmove = null;
    //         this.className = "dot-button";
    //     }).bind(this);
    // }
}

function slide(isRight) {
    let slider = document.getElementById("entity"), newLeft = isRight ? slider.offsetLeft + slider.firstElementChild.getBoundingClientRect().width : slider.offsetLeft - slider.firstElementChild.getBoundingClientRect().width;
    slider.style.left = `${newLeft}px`;
}